<template>
  <div class="patient-number-date">
    <div class="patient-number-date-inside">
      <div class="header">
        <div class="left item">
          <img
              alt="左侧"
              src="@/components/assets/images/design/1-12.webp"
          />
        </div>
        <div class="middle item">请点击下方卡片选择预约日期</div>
        <div class="right item">
          <img
              alt="右侧"
              src="@/components/assets/images/design/1-12.webp"
          />
        </div>
      </div>
      <div class="patient-number-wrap">
        <el-row class="patient-number-area">
          <template v-for="item in futureDateInfo">
            <el-col :span="24">
              <div class="patient-number-item" @click="handleClick(item)">
                <div class="left">
                  <div class="date">{{ item.dateInfo }}</div>
                  <div class="week">{{ item.weekInfo }}</div>
                </div>
                <div class="right">
                  预约
                  <i class="el-icon el-icon-arrow-right"/>
                </div>
              </div>
            </el-col>
          </template>
        </el-row>
      </div>
    </div>
  </div>
</template>

<script>
import {setDateInfo} from "@sc/DRCbiz/store/actions";

export default {
  name: 'PatientNumberDate',

  componentName: "PatientNumberDate",

  components: {},

  data() {
    return {
      weeksInfo: {
        0: '周日',
        1: '周一',
        2: '周二',
        3: '周三',
        4: '周四',
        5: '周五',
        6: '周六',
      }
    }
  },

  computed: {
    futureDateInfo() {
      const futureDate = [];
      for (let i = 1; i < 8; i++) {
        let params = Object();
        let dateInfo = this.$day().add(i, 'day').format('YYYY-MM-DD');
        let weekInfo = this.$day(dateInfo).day();
        Reflect.set(params, 'dateInfo', dateInfo);
        Reflect.set(params, 'weekInfo', this.weeksInfo[weekInfo]);
        futureDate.push(params);
      }
      return futureDate
    },

    stepInfo() {
      return this.$store.getters['DRCbiz/getStepsInfo']
    },
  },

  mounted() {
  },

  methods: {
    handleClick(row) {
      let stepInfo = parseInt(this.stepInfo);
      this.$store.dispatch('DRCbiz/setDateInfo', row);
      this.$store.dispatch('DRCbiz/setStepsInfo', ++stepInfo);
    }
  },
}

</script>

<style scoped lang="scss">
@import "assets/style";
</style>